<template>
  <div>
    <div class="fillIn">
      <p class="JournalProfessional">中文题目:</p>
      <Input v-model="title1" placeholder=""/>
      <p class="JournalProfessional">关键字:</p>
      <Input v-model="keyword1" placeholder=""/>
      <p class="JournalProfessional">摘要:</p>
      <Input v-model="abstract1" type="textarea" :rows="8" placeholder=""/>
      <p class="JournalProfessional">正文:</p>
      <Input v-model="mainBody1" type="textarea" :rows="8" placeholder=""/>
      <p class="JournalProfessional">文献:</p>
      <Input v-model="literature1" type="textarea" :rows="8" placeholder=""/>
    </div>
  </div>
</template>

<script>
  export default {
    props: {
      title: {
        type: String,
      },
      keyword: {
        type: String,
      },
      abstract: {
        type: String,
      },
      literature: {
        type: String,
      },
      mainBody: {
        type: String,
      },
    },
    data() {
      return {
        title1: '',
        keyword1: '',
        abstract1: '',
        literature1: '',
        mainBody1: '',
        /*文件*/
        mapData: '',
        file: '',
      }
    },
    watch: {
      title1() {
        if (this.title1) {
          this.$emit('returnTitle', this.title1);
        }
      },
      keyword1() {
        if (this.keyword1) {
          this.$emit('returnKeyword', this.keyword1);
        }
      },
      abstract1() {
        if (this.abstract1) {
          this.$emit('returnAbstract', this.abstract1);
        }
      },
      literature1() {
        if (this.literature1) {
          this.$emit('returnLiterature', this.literature1);
        }
      },
      mainBody1() {
        if (this.mainBody1) {
          this.$emit('returnMainBody', this.mainBody1);
        }
      },
    },
    mounted() {
      if (this.title) {
        this.title1 = this.title;
        this.$emit('returnTitle', this.title1);
      }
      if (this.keyword) {
        this.keyword1 = this.keyword;
        this.$emit('returnKeyword', this.keyword1);
      }
      if (this.abstract) {

        this.abstract1 = this.abstract;
        this.$emit('returnAbstract', this.abstract1);
      }
      if (this.literature) {
        this.literature1 = this.literature;
        this.$emit('returnLiterature', this.literature1);
      }
      if (this.mainBody) {
        this.mainBody1 = this.mainBody;
        this.$emit('returnMainBody', this.mainBody1);
      }
    },
  }
</script>

<style scoped>
  .fillIn {
    font-size: 15px;
    font-weight: bold;
    padding-top: 10px;
  }

  .upload {
    padding: 4px 10px;
    height: 20px;
    line-height: 20px;
    text-decoration: none;

  }

  .upload .red {
    color: red;
    border-bottom: 1px solid red;
  }

  .upload span {
    color: #000;
  }

  .upload .upload__input {
    position: absolute;
    left: 0;
    opacity: 0;
    width: 170px;
  }
</style>
